<div class="container">
	<header>
		<h1>Ink</h1>
	</header>
	<nav>
		<ul>
			<li><a href="#">Home</a>
		</ul>
	</nav>
	<main class="main">
		<h1>Team collaboration done right</h1>
	</main>
	<div class="sidebar-top">
		<form>
			<h3>Login</h3>
		</form>
	</div>
	<div class="sidebar-bottom">
		<small>Starting at</small>
	</div>
</div>
<style>
.container{
	display:grid;
	grid-template-columns:[left-start] 2fr [left-end right-start] 1fr;
	grid-template-rows:repeat(4,[row] auto);
	grid-gap:1.5em;
	max-width:1080px;
	margin:0 auto;
}
header,nav{
	grid-column:left-start/right-end;
	grid-row:span 1;
}
.main{
	grid-column:left;
	grid-row:row 3/span 2;
}
.sidebar-top{
	grid-column:right;
	grid-row:3/4;
}
.sidebar-bottom{
	grid-column:right;
	grid-row:4/5;
}
</style>